<template>
  <view>
    <z-paging
      ref="paging"
      v-model="dataList"
      @query="queryList"
      :fixed="true"
      :auto="false"
      :auto-show-back-to-top="true"
      :empty-view-img="`${getImageUrl('empty.png')} `"
      empty-view-text="暂无订单数据~"
      :empty-view-img-style="imgStyle"
    >
      <view class="" slot="top">
        <u-navbar height="50">
          <view class="search-box">
            <u-search
              placeholder="搜索施工队"
              width="300"
              :show-action="false"
              v-model="keyword"
            ></u-search>
          </view>
        </u-navbar>
        <!-- <view class="sort-bar">
					<u-dropdown ref="uDropdown">
						<u-dropdown-item :title="pitchOnCity.label">
							<view class="slot-content">
								<view class="region-select" style="background-color: #FFFFFF; display: flex;">
									<scroll-view class="region-select-left" scroll-y="true" style="height: 500rpx;">
										<view class="region-item" v-for="(item, index) in province" :key="index" :style="current ==  index ? `background-color: #FFFFFF;corlor:#0F76BC;width: 100%;` : ``" @click="checkProvince(item, index)">{{item.label}}</view>
									</scroll-view>
									<view class="region-select-right" >
										<view class="region-right-item" v-for="item in filterCity" @click="checkCity(item)">
											<view class="region-right-label">
												{{item.label}}
											</view>
											<view class="check-cir" :style="item.value == pitchOnCity.value ? `background-color: #0F76BC;` : ''">

											</view>
										</view>
									</view>
								</view>
							</view>
						</u-dropdown-item>

						<u-dropdown-item v-model="value3" title="经验" :options="options3"></u-dropdown-item>
					</u-dropdown>
				</view> -->
      </view>
      <view class="" style="padding: 20rpx">
        <view
          class="info-view"
          @click="routeTo(item)"
          v-for="(item, index) in dataList"
          :key="index"
        >
          <view class="info-top">
            <view class="">
              <text>{{ item.name.substr(0, 1) + '**' }}</text>
              <view class="sign"> 已实名 </view>
              <view class="sign-info">
                {{ item.exceptWorkCity }}-{{ item.sex == 1 ? '男' : '女' }}-{{
                  formatTime(item.birthday)
                }}-经验{{ item.workYear }}年
              </view>
            </view>
            <view class="info-top-btn"> 联系雇佣TA </view>
          </view>
          <view class="info-desc">
            {{ item.content }}
          </view>
          <!-- <u-divider style="margin:20rpx 0;"  half-width="700" border-color="#6d6d6d"></u-divider> -->
          <view class="info-floor">
            <view class="info-floor-item">
              <view class=""> 参与项目 </view>
              <p class=""> {{ item.enrollCount }}次 </p>
            </view>

            <view class="info-floor-item">
              <view class=""> 施工案例 </view>
              <p class=""> {{ item.caseCount }}次 </p>
            </view>

            <view class="info-floor-item">
              <view class=""> 综合评分 </view>
              <p class=""> {{ item.scores }}分 </p>
            </view>
          </view>
        </view>
      </view>
    </z-paging>
  </view>
</template>

<script>
import province from '../../node_modules/uview-ui/libs/util/province.js'
import city from '../../node_modules/uview-ui/libs/util/city.js'

export default {
  data() {
    return {
      current: '',
      value1: 1,
      value2: 2,
      province,
      name: '',
      startWorkYear: '',
      endWorkYear: '',
      pitchOnCity: {
        label: '地区'
      },
      filterCity: [],
      options2: [
        {
          label: '全部类型',
          value: 1
        },
        {
          label: '住房',
          value: 2
        },
        {
          label: '体育',
          value: 3
        }
      ],
      options3: [
        {
          label: '全部类型',
          value: 1
        },
        {
          label: '正在进行',
          value: 2
        },
        {
          label: '即将开始',
          value: 3
        }
      ],
      dataList: []
    }
  },
  onLoad() {
    this.queryList()
  },
  computed: {
    formatTime() {
      return (e) => this.$utils.parseTime(e, '{y}-{m}-{d}')
    }
  },
  methods: {
    queryList(pageNo = 1, pageSize = 10) {
      this.$u
        .get(
          `/app-api/construction/resume/page?pageNo=${pageNo}&pageSize=${pageSize}&name=${this.name}
							&startWorkYear=${this.startWorkYear}
							&endWorkYear=${this.endWorkYear}`
        )
        .then((res) => {
          this.$refs.paging.complete(res.data.list)
        })
    },
    initData(page, pageSize, status) {
      //let self = this;
      // self.$u.api.getOrderList({
      // 	limit: pageSize,
      // 	page: page,
      // 	status: status
      // }).then(res => {
      // 	self.onOrderLoad(self.current, res.list, false);
      // }).catch(res => {
      // 	self.onOrderLoad(self.current, null, false);
      // });
      //this.onOrderLoad(this.current, this.itemList, false);
    },
    checkProvince(p, index) {
      this.current = index
      this.filterCity = city[index]
    },
    checkCity(c) {
      this.pitchOnCity = c
      setTimeout(() => {
        this.$refs.uDropdown.close()
      }, 100)
    },
    routeTo(item) {
      uni.navigateTo({
        url: '/other/construction-team-detail/construction-team-detail?id=' + item.userId
      })
    }
  }
}
</script>

<style>
page {
  background-color: #eeeeef;
}
.search-box {
  display: inline-block;
  width: 290px;
  margin-left: 20rpx;
}

.sort-bar {
  display: flex;
  justify-content: space-between;
  background-color: #fff;
  padding: 20rpx 25rpx;
}

.info-view {
  padding: 20rpx;
  background-color: #fff;
  margin-top: 20rpx;
}
.info-top {
  margin: 15rpx 0;
  position: relative;
}
.info-top text {
  font-size: 33rpx;
  font-weight: 700;
}
.sign {
  display: inline-block;
  font-size: 28rpx;
  padding: 8rpx 18rpx;
  background-color: #8cc340;
  color: #fff;
  border-radius: 30rpx;
  margin-left: 10rpx;
}
.sign-info {
  font-size: 30rpx;
  color: #999999;
}

.info-top-btn {
  position: absolute;
  top: 0;
  right: 2rpx;
  display: inline-block;
  font-size: 32rpx;
  padding: 10rpx 20rpx;
  background-color: #0f76bc;
  border-radius: 30rpx;
  color: #fff;
}

.info-desc {
  font-size: 32rpx;
  max-height: 80rpx;
  overflow: hidden;
}

.info-floor {
  display: flex;
  justify-content: space-between;
}

.info-floor-item {
  line-height: 50rpx;
}
.info-floor-item view {
  text-align: center;
  color: #999999;
}
.info-floor-item p {
  text-align: center;
  color: #0f76bc;
  font-size: 32rpx;
}

.region-select {
  font-size: 32rpx;
  line-height: 70rpx;
}

.region-select-left {
  background-color: #f5f5f5;
  flex: 4;
  text-indent: 20rpx;
}

.region-select-right {
  flex: 6;
  display: flex;
  flex-direction: column;
  height: 500rpx;
  overflow: scroll;
  padding: 20rpx;
}
.region-right-item {
  position: relative;
}

.check-cir {
  position: absolute;
  right: 20rpx;
  top: 13rpx;
  width: 42rpx;
  height: 42rpx;
  border: 2rpx #999999 solid;
  border-radius: 42rpx;
}
</style>
